<template>
	<!-- 我的动态 -->
	<view class="myDynamic">
<!-- 		<view class="bg_top" :style="'height:'+(2*menuButtonInfo.top+48)+'rpx'"></view>
		<view class="top z_index" :style="'padding-top:'+ menuButtonInfo.top + 'px'">
			<u-icon @click="goNavigateBack" class="top_icon" name="arrow-left" color="#000000" size="40"></u-icon>
			<view class="top_title">我的动态</view>
		</view> -->
		<!-- <view class="falls">
		       <fallsmy @addRandomDatas="onReachBottom" :loadStatus="loadStatux" :flowList="flowLists" ></fallsmy>
		</view> -->
		<!-- <view class="falls" :style="'padding-top:'+(2*menuButtonInfo.top +58)+'rpx'"> -->
		<view class="falls" v-if="isArise">
			<fallsmynext ref="fallsmynext" :dynamicNums="dynamicNum" @addRandomDatas="onReachBottom" :loadStatus="loadStatux" :flowList="flowLists"></fallsmynext>
		</view>
		<!-- <empty v-else title="暂无动态"></empty> -->
		
		<!-- 动态 -->
		<view  v-if="isArise" class="dynamic" @click="goReleaseDynamics">
			<image src="https://z3.ax1x.com/2021/08/31/hd9G6O.png"></image>
		</view>
		<cmerror v-if="!isArise"></cmerror>
	</view>
</template>

<script>
	import cmerror from '@/components/cmerror/cmerror.vue'
	import fallsmynext from "@/components/falls/fallsmynext.vue";
	import empty from "@/components/defaultpage/empty.vue"
	import network from "@/components/defaultpage/network.vue"
	export default {
		data() {
			return {
				// menuButtonInfo: {
				// 	top: 25
				// },
				loadStatux: 'Loading',
				flowLists: [],
				isTrue: true,
				dynamicNum: 1,
				pageSize: 6,
				userObjs: {}
			}
		},
		onLoad(pamras) {
			// this.userObjs = JSON.parse(pamras.userObjs);
			// debugger
			// this.init(userObjs)
		},
		onReachBottom(){
			if(this.isTrue){
				this.loadStatux = 'Loading';
				// 模拟数据加载
				this.dynamicNum++;
				// debugger
				
					this.initFansDynamic();
				
				
			}
		},
		
		onShow(){
			this.initOnShow().then(res=>{
				console.log(this.flowLists)
			    if(this.dynamicNum == 1){
					this.initFansDynamic();
				}
				
			})
			// debugger
		
		},
		computed: {
			flourUser() {
				return this.$store.state.flourUser;
			},
			isArise() {
				return this.$store.state.isArise;
			},
			Version() {
				return this.$store.state.Version;
			}
		},
		methods: {
			// 数组去重
			//  方法2：利用reduce方法遍历数组,reduce第一个参数是遍历需要执行的函数，第二个参数是item的初始值
			deWeight(arr) {
				var obj = {};
				let newArr = arr.reduce(function(item, next) {
					obj[next.idx] ? '' : obj[next.idx] = true && item.push(next);
					return item;
				}, []);
				return newArr;
			},
			initOnShow() {
				// uni.getStorage({
				//     key: 'userPhone',
				//     success: res => {
				// 		this.show = false
				// 	},
				// 	fail: err => {
				// 		this.show = true
				// 	}
				// });
				return new Promise((ress, rejj) => {
			
					this.isShow = 2;
					this.$apis.accountInfo().then(res => {
						if (res.code == 200) {
							this.userPhoneApi = res.data.phone;
							this.imgs = res.data.awardPrivilegeBg;
							if (res.data.version == this.Version) {
								this.$store.commit('updataArise', true);
								
							} else {
								this.$store.commit('updataArise', false);
							}
			              ress();
			              }
			
						console.log("个人信息成功", res)
					}).catch(err => {
						
						ress();
						console.log("个人信息错误", err)
					})
				})
			
			
			
			
			},
			
			
			goReleaseDynamics() {
			
				uni.navigateTo({
					
					url: "/pages/probeShop/newReleaseDynamics/newReleaseDynamics"
				})
			},
			// 请求用户动态数据列表
			initFansDynamic() {
				// /amianfrontend/dynamic/list/{userId}
				let req = {};
				req.pageNum = this.dynamicNum;
				req.pageSize = this.pageSize;
			
				this.$apis.dynamicList(
				 req
				).then(res => {
					if (res.code == 200) {
						let flowListsPush = [];
						let newflowLists = JSON.parse(JSON.stringify(this.flowLists));
						if (res.rows.length != 0) {
							
							res.rows.forEach(item => {
								flowListsPush.push({
									page: '../../../pages/flour/flourdetails/flourdetails',
									image: item.imageList[0],
									imageList: item.imageList,
									activityId: item.activityId,
									dynamicId: item.dynamicId,
									id:  item.dynamicId,
									idx:  item.dynamicId,
									isTrue: true,
									// name: item.
								})
							})
							// debugger
							newflowLists = [...newflowLists,...flowListsPush]
							newflowLists = this.deWeight(newflowLists);
							this.flowLists = JSON.parse(JSON.stringify(newflowLists));
							console.log("this.lists请求后的",this.flowLists);
							if(res.rows.length < this.pageSize){
							// debugger
							this.isTrue = false;
							this.loadStatux = 'moduleNomore';
						}
							// debugger
						} else {
							// debugger
							this.isTrue = false;
							this.loadStatux = 'moduleNomore';
							if(this.dynamicNum == 1){
								this.loadStatux = "empty"
							}
						}
			
					}
				})
			},
			
			goNavigateBack() {
				uni.navigateBack()
			},
			init(param) {
				// // #ifndef H5 || APP-PLUS || MP-ALIPAY
				// this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
				// // #endif
			},
			// userdynamiclist
		},
		components:{
			fallsmynext,
			empty,
			network
		}
	}
</script>

<style lang="scss">
	.myDynamic {
		.dynamic{
			right: 48rpx;
			z-index: 11;
			position: fixed;
			width: 144rpx;
			height: 144rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			border-radius: 50%;
			
			font-size: 13px;
			font-family: Source Han Sans CN, Source Han Sans CN-Bold;
			font-weight: 700;
			bottom: 370rpx;
			background: #f10200;
			border-radius: 50%;
			box-shadow: 0px 5px 15px -5px #f10200;
			
			
			image {
				width: 50rpx;
				height: 50rpx;
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
			}
		}
		.demo-warter {
			// border-radius: 8px;
			margin-bottom: 4rpx;
			
			position: relative;
		}
		 .warter-left {
			 margin-right: 4rpx;
		 }
		.bg_top {
			width: 750rpx;
			background-color: #ffffff;
			position: fixed;
			z-index: 9;
		}

		.z_index {
			z-index: 10;
		}

		.top {
			width: 750rpx;
			height: 48rpx;
			background-color: #FFFFFF;
			position: fixed;
			padding-bottom: 20rpx;
		}

		.top_icon {
			margin-left: 32rpx;
			display: inline-block;
		}

		.top_title {
			position: absolute;
			font-size: 34rpx;
			font-weight: 500;
			line-height: 48rpx;
			display: inline-block;
			left: 50%;
			transform: translate(-50%);
		}
		.falls{
			height: 100vh;
		}
	}
</style>
